<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		<form action="" method="post">
		<table border="1" cellspacing="0" cellpadding="10" id="table_id">
			<tr>
				<th></th>
				<th>姓名</th>
				<th>性别</th>
				<th>年龄</th>
				<th>家庭住址</th>
			</tr>
			<tr>
				<td><input type="checkbox" name="inputname1" id="inputid1" value="" /></td>
				<td>张三</td>
				<td class="sex">男</td>
				<td>20</td>
				<td>福建省龙岩市新罗区</td>
			</tr>
			<tr>
				<td><input type="checkbox" name="" id="" value="" /></td>
				<td>张三</td>
				<td class="sex">男</td>
				<td>20</td>
				<td>福建省龙岩市新罗区</td>
			</tr>
			<tr>
				<td><input type="checkbox" name="" id="" value="" /></td>
				<td>李梅</td>
				<td class="sex">女</td>
				<td>20</td>
				<td>福建省龙岩市新罗区</td>
			</tr>
			<tr>
				<td><input type="checkbox" name="" id="" value="" /></td>
				<td>小丽</td>
				<td class="sex">女</td>
				<td>20</td>
				<td>福建省龙岩市新罗区</td>
			</tr>
			<tr>
				<td><input type="checkbox" name="" id="" value="" /></td>
				<td>小丽</td>
				<td class="sex">女</td>
				<td>20</td>
				<td>福建省龙岩市新罗区</td>
			</tr>
			
		</table>
		</form>
		
		<input type="checkbox" name="" id="inputid2" value="" onclick="doSelAll();" />全选
		<input type="checkbox" name="" id="inputid3" value="" onclick="doSelAll1();" />全选男
		<input type="checkbox" name="" id="inputid4" value="" onclick="doSelAll2();" />全选女
	</body>
	<script type="text/javascript">
		function doSelAll(){
			var table_id = document.getElementById('table_id');
			var inputAll = table_id.getElementsByTagName('input');
			console.log(inputAll)
			var checkAllValue = document.getElementById('inputid2').checked;
			for (var i = 0; i < inputAll.length; i++) {
			// 所有选项的状态 要与 全选框checked状态相同
				inputAll[i].checked = checkAllValue;
			}
			
		}
		function doSelAll1(){
			var stu_man = document.getElementsByClassName('sex')
			for (var i=0;i<stu_man.length;i++) {
				if(stu_man[i].innerText == '男'){
					var table_id = document.getElementById('table_id');
					var inputAll = table_id.getElementsByTagName('input');
					var checkAllValue = document.getElementById('inputid3').checked;
					inputAll[i].checked = checkAllValue
				}
			}
		   }
		
		function doSelAll2(){
			var stu_man = document.getElementsByClassName('sex')
			for (var i=0;i<stu_man.length;i++) {
				if(stu_man[i].innerText == '女'){
					var table_id = document.getElementById('table_id');
					var inputAll = table_id.getElementsByTagName('input');
					var checkAllValue = document.getElementById('inputid4').checked;
					inputAll[i].checked = checkAllValue
				}
			}
		   }
		
	</script>
</html>
